<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>添加餐桌</title>
    <link rel="stylesheet" th:href="@{/layuiadmin/layui/css/layui.css}" href="../../static/layui/css/layui.css"
          media="all"/>
    <style>
        body {
            margin: 10px;
        }
    </style>
</head>
<body>
<div class="layui-card">
    <div class="layui-card-body">
        <form class="layui-form layui-form-pane" action="" lay-filter="component-form-element">
            <div class="layui-form-item">
                <!--隐藏域-->
                <div class="layui-input-inline layui-hide">
                    <input type="text" name="deskId" th:value="${desk.deskId}" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">桌位编号</label>
                <div class="layui-input-block">
                    <input type="text" th:value="${desk.deskCode}" name="deskCode" id="deskCode" lay-verify="required"
                           placeholder="桌位编号"
                           autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">餐桌状态</label>
                <div class="layui-input-block">
                    <th:block th:if="${desk.idleStatus}==0">
                        <input type="radio" name="idleStatus" value="0" title="空闲" checked>
                        <input type="radio" name="idleStatus" value="1" title="有人">
                        <input type="radio" name="idleStatus" value="2" title="待清理">
                    </th:block>
                    <th:block th:if="${desk.idleStatus}==1">
                        <input type="radio" name="idleStatus" value="0" title="空闲">
                        <input type="radio" name="idleStatus" value="1" title="有人" checked>
                        <input type="radio" name="idleStatus" value="2" title="待清理">
                    </th:block>
                    <th:block th:if="${desk.idleStatus}==2">
                        <input type="radio" name="idleStatus" value="0" title="空闲">
                        <input type="radio" name="idleStatus" value="1" title="有人">
                        <input type="radio" name="idleStatus" value="2" title="待清理" checked>
                    </th:block>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">座位人数</label>
                <div class="layui-input-block">
                    <input type="text" th:value="${desk.peopleCount}" name="peopleCount" id="peopleCount" lay-verify="required|number|int_number"
                           placeholder="座位人数"
                           autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item layui-hide">
                <input type="button" lay-submit lay-filter="LAY-user-front-submit"
                       id="LAY-user-front-submit" value="确认">
            </div>
        </form>
    </div>
</div>
<script th:src="@{/layuiadmin/layui/layui.js}" src="../../static/layuiadmin/layui/layui.js"></script>
<script>
    layui.use(['form', 'laydate', "layer"], function () {
        var $ = layui.$
            , admin = layui.admin
            , element = layui.element
            , form = layui.form
            , laydate = layui.laydate
            , layer = layui.layer;

        //获取from表单提交事件
        //此处submit中的值是lay-filter
        form.on('submit(component-form-element)', function (data) {
        });
        //自定义验证
        form.verify({
            //验证正数
            positive_number: function (value, item) {
                if (parseFloat(value) < 0) {
                    return '必须为正数';
                }
            },
            int_number: function (value, item) {
                if (!/^(0|\+?[1-9][0-9]*)$/.test(value)) {
                    return '必须为正整数';
                }
            }
        });
    });
</script>
</body>
</html>